<template>
  <a-modal
    :title="isEdit ? '修改外设' : '新增外设'"
    :visible="show"
    @cancel="handleCancel"
    width="50%"
    class="procedure-modal"
  >
    <a-form-model
      ref="ruleForm"
      :model="item"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="外设条码" prop="PrinterBarcode">
            <a-input
              v-model="item.PrinterBarcode"
              disabled
              placeholder="外设条码无需填写自动生成"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="外设编码" prop="PrinterNo">
            <a-input v-model="item.PrinterNo" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="外设名称" prop="PrinterName">
            <a-input v-model="item.PrinterName" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="外设IP地址" prop="PrinterIP">
            <a-input v-model="item.PrinterIP" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="外设端口" prop="PrinterPort">
            <a-input v-model="item.PrinterPort" />
          </a-form-model-item>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="12">
          <a-form-model-item label="外设描述">
            <a-input v-model="item.PrinterDescription" type="textarea" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="比例" prop="Proportion">
            <a-input v-model="item.Proportion" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="是否反转" prop="IsReverse">
            <a-radio-group name="radioGroup" v-model:value="item.IsReverse">
              <a-radio :value="true">是</a-radio>
              <a-radio :value="false">否</a-radio>
            </a-radio-group>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="是否取绝对值" prop="IsAbsolute">
            <a-radio-group name="radioGroup" v-model:value="item.IsAbsolute">
              <a-radio :value="true">是</a-radio>
              <a-radio :value="false">否</a-radio>
            </a-radio-group>
          </a-form-model-item>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="12">
          <a-form-model-item label="打印DPI" prop="DPI">
            <a-input v-model="item.DPI" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="打印DPM" prop="DPM">
            <a-input v-model="item.DPM" />
          </a-form-model-item>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="12">
          <a-form-model-item label="打印长度" prop="PaperLong">
            <a-input v-model="item.PaperLong" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="打印宽度" prop="PaperWidth">
            <a-input v-model="item.PaperWidth" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="取数指令" prop="DPM">
            <a-input v-model="item.FetchInstruction" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="清零指令" prop="DPI">
            <a-input v-model="item.Clearlnstruction" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="去皮指令" prop="DPM">
            <a-input v-model="item.PeelingInstruction" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="取值模式" prop="ValueMode">
            <a-radio-group
              name="radioGroup"
              v-model:value="item.ValueMode"
              @change="switchChange"
            >
              <a-radio :value="0">取值分隔符</a-radio>
              <a-radio :value="1">截取长度</a-radio>
            </a-radio-group>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row v-if="item.ValueMode == 1">
        <a-col :span="12">
          <a-form-model-item label="截取长度" prop="InterceptedLength">
            <a-input v-model="item.InterceptedLength" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="截取开始位置" prop="StartIndex">
            <a-input v-model="item.StartIndex" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row v-if="item.ValueMode == 1">
        <a-col :span="12">
          <a-form-model-item label="数据长度" prop="DPI">
            <a-input v-model="item.DataLength" />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row v-if="item.ValueMode == 0">
        <a-col :span="12">
          <a-form-model-item label="数组分隔符" prop="ArraySplitStr">
            <a-input v-model="item.ArraySplitStr" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="值分隔符" prop="ValueSplitStr">
            <a-input v-model="item.ValueSplitStr" />
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
    <template slot="footer">
      <a-button :loading="loading" @click="handleCancel"> 返回 </a-button>
      <a-button type="primary" :loading="loading" @click="handleOk">
        提交
      </a-button>
    </template>
  </a-modal>
</template>
<script>
import { insTabPrinter, updTabPrinter } from "@/api/peripherals";
export default {
  props: { show: Boolean, isEdit: Boolean, item: Object },
  data() {
    return {
      labelCol: { span: 6 },
      wrapperCol: { span: 16 },
      loading: false,
    };
  },
  mounted() {},
  computed: {},
  methods: {
    /** 切换清除对应的选项 */
    switchChange() {
      if (this.item.ValueMode == 0) {
      } else {
        this.item.ValueSplitStr = "";
        this.item.ArraySplitStr = "";
      }
    },
    //关闭弹窗
    handleCancel() {
      this.$emit("update:show", false);
      this.$refs.ruleForm.resetFields();
    },
    //确认添加/修改
    handleOk() {
      try {
        this.$refs.ruleForm.validate(async (valid) => {
          if (!valid) {
            this.$message.error("请填写必填项");
            return;
          }

          this.loading = true;

          // 根据是否是编辑状态选择对应的操作函数和成功提示信息
          const operation = this.isEdit ? updTabPrinter : insTabPrinter;
          const successMessage = this.isEdit ? "修改成功" : "新增成功";

          // 执行操作
          let res = await operation(this.item);

          if (res && res.Status === 10000) {
            // 操作成功后的通用逻辑
            this.$message.success(successMessage);
            this.handleCancel();
            this.$emit("updata");
          } else {
            const errorMessage =
              res && res.Message ? res.Message : "操作失败，请重试";
            this.$message.error(errorMessage);
          }
        });
      } catch (e) {
        // 错误处理
        const errorMessage = e.message || "操作失败，请重试";
        this.$message.error(errorMessage);
      } finally {
        // 确保 loading 状态被重置
        this.loading = false;
      }
    },
    /**  */
  },
};
</script>
<style scoped></style>
